@import './variables';
* {
    margin:0 auto;
}
#app {
    height:100%;
    background:url(~@/assets/loginbg.png) center;
    .ant-layout {
        background:none;
    }
}
.clear {
    clear: both;
}
.ant-layout-header.header {
    color:#fff;
    width:100%;
    background: rgba($color: $primary-color, $alpha: 0.5);
    padding-top: 10px;
    position: relative;
    .circle {
        width:70px;
        height:70px;
        float:left;
        background:url(~@/assets/logo-bg.png) center;
        background-size: contain;
        line-height: 60px;
        text-align: center;
        color:$primary-color;
        font-size:28px;
        font-weight: bold;
        padding-left: 8px;
    }
    .site-name {
        font-size:24px;
        font-weight: bold;
    }
    .platuser {
        float:right;
    }
}
.ant-layout-sider.sider {
    background: rgba($color: $primary-color, $alpha: 0.5);
    ul {
        padding:0;
    }
    .ant-menu {
        background:none;
    }
    .ant-menu {
        color:#fff;
        font-size: 16px;
    }
    .ant-menu-item a {
        color:#fff;
    }
    .ant-menu-item:hover {
        color:$primary-color;
    }
    .ant-menu-item a:hover,
    .ant-menu-item-selected a {
        color:$primary-color;
    }
    .ant-menu-submenu-selected {
        color:$primary-color;
    }
    .ant-menu-inline .ant-menu-item {
        margin-top:0;
    }
    .ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected {
        background-color: #fafafa;
    }
    .ant-menu-vertical .ant-menu-item::after, .ant-menu-vertical-left .ant-menu-item::after, .ant-menu-vertical-right .ant-menu-item::after, .ant-menu-inline .ant-menu-item::after {
        display: none;
    }
    .ant-menu-light .ant-menu-item:hover, .ant-menu-light .ant-menu-item-active, .ant-menu-light .ant-menu:not(.ant-menu-inline) .ant-menu-submenu-open, .ant-menu-light .ant-menu-submenu-active, .ant-menu-light .ant-menu-submenu-title:hover {
        color:$primary-color;
    }
    .ant-menu-submenu:hover > .ant-menu-submenu-title > .ant-menu-submenu-expand-icon, .ant-menu-submenu:hover > .ant-menu-submenu-title > .ant-menu-submenu-arrow {
        color:$primary-color;
    }
    .ant-menu-inline, .ant-menu-vertical, .ant-menu-vertical-left {
        border-right:none;
    }
}
.ant-layout-content {
    background:rgba(255,255,255,0.3);
    overflow: auto;
    .ant-table {
        background:rgba($color: #fff, $alpha: 0.3);
    }
    .ant-input-affix-wrapper {
        background:rgba($color: #fff, $alpha: 0.5)
    }
    .ant-input {
        background:rgba($color: #fff, $alpha: 0)
    }

    .ant-table-thead > tr > th {
        background:rgba($color: #fafafa, $alpha: 0.3);
    }
    .ant-select:not(.ant-select-customize-input) .ant-select-selector {
        background:rgba($color: #fff, $alpha: 0.3);
    }
    .ant-btn-primary {
        background:$primary-color;
        border-color: $primary-color;
    }
    .ant-btn-primary:hover {
        background:rgba($color: $primary-color, $alpha: 0.8);
        border-color: $primary-color;
    }
    .ant-btn-primary:hover, .ant-btn-primary:focus{
        background:rgba($color: $primary-color, $alpha: 0.8);
        border-color: $primary-color;
    }
    .ant-pagination-item {
        background:rgba($color: #fff, $alpha: 0.3);
    }
    .ant-pagination-prev .ant-pagination-item-link, .ant-pagination-next .ant-pagination-item-link {
        background:rgba($color: #fff, $alpha: 0.3);
    }
    .ant-btn-link {
        color:$primary-color;
    }
    .ant-tabs-nav .ant-tabs-tab:hover,.ant-tabs-nav .ant-tabs-tab-active {
        color:$primary-color;
    }
    .ant-tabs-ink-bar {
        background-color: $primary-color;
    }
    .ant-btn-background-ghost.ant-btn-primary {
        color:$primary-color;
        border-color: $primary-color;
    }
    .ant-btn-background-ghost.ant-btn-primary:hover, 
    .ant-btn-background-ghost.ant-btn-primary:focus  {
        color:rgba($color: $primary-color, $alpha: 0.8);
        border-color: rgba($color: $primary-color, $alpha: 0.8);
    }
    .ant-table-placeholder {
        background: rgba($color: #fff, $alpha: 0.3);
    }
}

.ant-modal,.ant-drawer-content{
    background:url(~@/assets/loginbg.png) center bottom;
    padding-bottom: 0 !important;
    .ant-modal-header,.ant-drawer-header {
        background:rgba($color: #fff, $alpha: 0.5);
    }
    .ant-modal-content {
        background: rgba($color: #fff, $alpha: 0.3);
    }
    .ant-table {
        background:rgba($color: #fff, $alpha: 0.3);
    }
    .ant-input-affix-wrapper {
        background:rgba($color: #fff, $alpha: 0.5)
    }
    .ant-input {
        background:rgba($color: #fff, $alpha: 0)
    }

    .ant-table-thead > tr > th {
        background:rgba($color: #fafafa, $alpha: 0.3);
    }
    .ant-select:not(.ant-select-customize-input) .ant-select-selector {
        background:rgba($color: #fff, $alpha: 0.3);
    }
    .ant-btn-primary {
        background:$primary-color;
        border-color: $primary-color;
    }
    .ant-btn-primary:hover {
        background:rgba($color: $primary-color, $alpha: 0.8);
        border-color: $primary-color;
    }
    .ant-btn-primary:hover, .ant-btn-primary:focus{
        background:rgba($color: $primary-color, $alpha: 0.8);
        border-color: $primary-color;
    }
    .ant-pagination-item {
        background:rgba($color: #fff, $alpha: 0.3);
    }
    .ant-pagination-prev .ant-pagination-item-link, .ant-pagination-next .ant-pagination-item-link {
        background:rgba($color: #fff, $alpha: 0.3);
    }
    .ant-btn-link {
        color:$primary-color;
    }
    .ant-tabs-nav .ant-tabs-tab:hover,.ant-tabs-nav .ant-tabs-tab-active {
        color:$primary-color;
    }
    .ant-tabs-ink-bar {
        background-color: $primary-color;
    }
    .ant-btn:hover {
        border-color: $primary-color;
        color:$primary-color;
    }
    .ant-btn-primary:hover {
        color:#fff;
    }
    .ant-input,.ant-input:focus:hover,.ant-input:focus,.ant-input-number-input {
        border-color:$primary-color;
    }
    .ant-input:focus {        
        box-shadow: 0 0 2px rgba($color: $primary-color, $alpha: 0.2);
    }
    .ant-select:not(.ant-select-customize-input) .ant-select-selector {
        border-color: $primary-color;
    }

    .ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector {
        border-color: $primary-color;
        box-shadow: 0 0 2px rgba($color: $primary-color, $alpha: 0.2);
    }
    .ant-radio-checked .ant-radio-inner {
        border-color: $primary-color;
    }
    .ant-radio-inner::after {
        background-color: $primary-color;
    }
    .ant-input-number {
        background-color: none !important;
        border-color: $primary-color;
    }
}

.edit-drawer {
    .ant-drawer-wrapper-body {
        position: relative;
        .ctrls {
            position: absolute;
            top: 11px;
            right: 16px;
        }
    }
}